* {
    margin: 0px;
    padding: 0px;
    list-style: none;
    text-decoration: none;
}
.banxin{
    width: 1164px;
    height: auto;
    margin: auto;
}
.cf::after{
    display: block;
    content: '';
    clear: both;
}
body::after{
    display: block;
    content: '';
    clear: both;
}
.top-nav{
    width: 100%;
    height: 155px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 999;
}
/* 导航背景视频 */
video{
    position: absolute;
    left:0;
    top:0;
    z-index: -9999;
    opacity: 1;
    object-fit:fill;
}
/* 隐藏video播放插件controls */
video::-webkit-media-controls{
    display:none;
}

.nav{
    width: 1333px;
    height: 36px;
    float: left;
    position: absolute;
    top: 10px;
    left: 0px;
}
/* nav-左边导航 */
.nav_left{
    width: 434px;
    height: 36px;
    float: left;
}
/* 主站图标 */
.icon_stand{
    width: 18px;
    height: 18px;
    float: left;
    font-size: 18px;
    margin: 1px -3px 0px 20px;
    color: #fff;
    cursor: pointer;
}
/* 左边导航 */
.top{
    width: inherit;
    background-color: lightblue;
}
.left_nav{
    width: inherit;
    line-height: 36px;
    text-align: center;
}
.left_nav a{
    height: 36px;
    color: #fff;
    font-size: 14px;
    position: relative;
    top: 0;
    left: 10px;
    float: left;
}
.nav_two{
    padding: 15px 5px;
}
.triangular{
    width: 0;
    height: 0;
    border-top: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
    position: absolute;
    top: 20px;
    left: 50%;
    opacity: 0;
    pointer-events:  none;
    transform: translate(-50%, 0);
}
.secNav{
    height: 230px;
    position: absolute;
    top: 38px;
    left: -20px;
    opacity: 0;
    pointer-events:  none;
    background-color: #fff;
    z-index: 1;
}
/* 主站 ，番剧，赛事*/

/* 游戏中心二级导航左边内容 */
.stand_left{
    width: 270px;
    height: 230px;
    float: left;
    margin: 0px 0px 0px 0px;
    cursor: pointer;
}
/* 二级左上 */
.stand_left_fate{
    width: 240px;
    height: 100px;
    float: left;
    margin: 10px 0px 0px 15px;
    background-image: url(../img/游戏中心-命运.jpg);
    background-size: 240px 100px;
    border-radius: 5px;
    font-size: 12px;
    color: #333;
    line-height: 174px;
    text-align: left;
}
/* 二级左下 */
.stand_left_down {
    width: 240px;
    height: 115px;
    float: left;
    margin: 0px 0px 0px 15px;
    border-radius: 5px;
    font-size: 12px;
    color: #333;
    line-height: 174px;
    text-align: left;
}
/* 二级左下的内容 */
.stand_left_down_box{
    width: 80px;
    height: 115px;
    float: left;
    margin-top: 5px;
}
.stand_left_down_pic_l{
    width: 60px;
    height: 60px;
    float: left;
    margin: 10px 0px 0px 10px;
    background-image: url(../img/游戏中心-公主连结.jpg);
    background-size: 60px 60px;
    border-radius: 5px;
}
.stand_left_down_words{
    width: 60px;
    height: 40px;
    float: left;
    margin: 5px 0px 0px 10px;
    font-size: 12px;
    color: #333;
    text-align: left;
    line-height: 20px;
}
.stand_left_down_pic_m{
    width: 60px;
    height: 60px;
    float: left;
    margin: 10px 0px 0px 10px;
    background-image: url(../img/游戏中心-碧蓝.jpg);
    background-size: 60px 60px;
    border-radius: 5px;
}
.stand_left_down_pic_r{
    width: 60px;
    height: 60px;
    float: left;
    margin: 10px 0px 0px 10px;
    background-image: url(../img/游戏中心-灰烬.jpg);
    background-size: 60px 60px;
    border-radius: 5px;
}
.stand_left_down_box:hover{
    background-color: #E7E7E7;
}
/* 游戏中心二级导航右边内容  */
.game_right{
    width: 180px;
    height: 230px;
    float: left;
    margin: 0px 0px 0px 0px;
}
/* 游戏预告图片 */
.game_right_top{
    width: 100px;
    height: 30px;
    margin: 5px 0px 0px 15px;
    background-image: url(../img/游戏预告.png);
    background-size: 100px 30px;
    z-index: 1;
    position: relative;
}
.game_right_line{
    width: 2px;
    height: 197px;
    float: left;
    margin: -8px 0px 0px 17px;
    background-color: rgb(206, 203, 203);
    box-shadow: 1px rgba(206, 203, 203, 203);
    z-index: 0;
}
.game_right_items{
    width: 161px;
    height: 195px;
    float: left;
    margin: -190px 0px 0px 19px;
    font-size: 12px;
    color: #333;
}
.game_right_items_li{
    position: relative;
    width: 161PX;
    height: 27PX;
    float: left;
    text-align: left;
    line-height: 27px;
    cursor: pointer;
}
.game_right_items_li span{
    position: absolute;
    display: block;
    float: left;
    margin-left: 10px;
}
.game_right_items_tian{
    position: absolute;
    width: 213PX;
    height: 220PX;
    background-image: url(../img/天地劫.png);
    background-size: 213px 220px;
    margin: -23px 0px 0px 130px;
    display: none;
}
.game_right_items_hero{
    position: absolute;
    width: 213PX;
    height: 210PX;
    float: left;
    background-image: url(../img/英雄联盟手游.png);
    background-size: 213px 220px;
    margin: -41px 0px 0px 130px;
    display: none;
}
.game_right_items_an{
    position: absolute;
    width: 213PX;
    height: 220PX;
    float: left;
    background-image: url(../img/暗黑-不朽.png);
    background-size: 213px 220px;
    margin: -77px 0px 0px 130px;
    display: none;
}
.game_right_items_apex{
    position: absolute;
    width: 213PX;
    height: 220PX;
    float: left;
    background-image: url(../img/Apex英雄.png);
    background-size: 213px 220px;
    margin: -106px 0px 0px 130px;
    display: none;
}
.game_right_items_di{
    position: absolute;
    width: 213PX;
    height: 220PX;
    float: left;
    background-image: url(../img/地下城.png);
    background-size: 213px 220px;
    margin: -129px 0px 0px 130px;
    display: none;
}
.game_right_items_ming{
    position: absolute;
    width: 213PX;
    height: 220PX;
    float: left;
    background-image: url(../img/黎明觉醒.png);
    background-size: 213px 220px;
    margin: -158px 0px 0px 130px;
    display: none;
}
.game_right_items_ha{
    position: absolute;
    width: 213PX;
    height: 220PX;
    float: left;
    background-image: url(../img/哈利-魔法觉醒.jpg);
    background-size: 213px 220px;
    margin: -185px 0px 0px 130px;
    display: none;
}
.game_right_items_li:hover{
    background-color: #E7E7E7;
}
.game_right_items_li:hover .game_right_items_tian,.game_right_items_li:hover .game_right_items_hero,.game_right_items_li:hover .game_right_items_an,.game_right_items_li:hover .game_right_items_apex,.game_right_items_li:hover .game_right_items_di,.game_right_items_li:hover .game_right_items_ming,.game_right_items_li:hover .game_right_items_ha{
    display: block;
}
/* 直播二级导航 */
.nav_live{
    width: 270px;
    height: 230px;
    float: left;
    cursor: pointer;
}
.nav_live_span{
    /* width: inherit; */
    height: 25px;
    display:block;
    float: left;
    font-size: 14px;
    margin-left: 30px;
    font-weight: 600;
    color: #fb7299;
}
/* 直播二级导航热门直播下的内容 */
.nav_live_left{
    width: 250px;
    height: 190px;
    float: left;
    margin: 0px 0px 0px 15px;
}
.nav_live_box{
    width: 80px;
    height: 90px;
    float: left;
    padding: 0px 0px 0px 3px;
}
.nav_live_first{
    width: 60px;
    height: 60px;
    float: left;
    margin: auto;
    background-image: url(../img/直播-1.jpg);
    background-size: 60px 60px;
    border-radius: 100%;
    margin: 10px 0px 0px 10px;
    position: relative;
}
.nav_live_dian{
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 60px;
    border-radius: 100%;
    display: none;
}
.nav_live_dianz{
    width: 13px;
    height: 13px;
    background-color: #fb7299;
    border-radius: 13px;
    margin: 25px 0px 0px 5px;
    float: left;
}
.nav_live_words{
    width: 35px;
    height: 50px;
    margin: 15px 0px 0px 5px;
    font-size: 14px;
    color: #666;
    float: left;
}
.nav_live_first:hover .nav_live_dian{
    display: block;
    background-color: rgba(255, 255, 255, 0.5);
}
.nav_live_name{
    width: 80px;
    height: 20px;
    float: left;
    font-size: 12px;
    color: #333;
    text-align: center;
    line-height: 20px;
}
.nav_live_second{
    width: 60px;
    height: 60px;
    float: left;
    margin: auto;
    background-image: url(../img/直播-2.jpg);
    background-size: 60px 60px;
    border-radius: 100%;
    margin: 10px 0px 0px 10px;
    position: relative;
}
.nav_live_second:hover .nav_live_dian,.nav_live_three:hover .nav_live_dian,.nav_live_four:hover .nav_live_dian,.nav_live_five:hover .nav_live_dian,.nav_live_six:hover .nav_live_dian{
    display: block;
    background-color: rgba(255, 255, 255, 0.5);
} 

.nav_live_three{
    width: 60px;
    height: 60px;
    float: left;
    margin: auto;
    background-image: url(../img/直播-3.jpg);
    background-size: 60px 60px;
    border-radius: 100%;
    margin: 10px 0px 0px 10px;
    position: relative;
}
.nav_live_four{
    width: 60px;
    height: 60px;
    float: left;
    margin: auto;
    background-image: url(../img/直播-4.jpg);
    background-size: 60px 60px;
    border-radius: 100%;
    margin: 10px 0px 0px 10px;
    position: relative;
}
.nav_live_five{
    width: 60px;
    height: 60px;
    float: left;
    margin: auto;
    background-image: url(../img/直播-5.jpg);
    background-size: 60px 60px;
    border-radius: 100%;
    margin: 10px 0px 0px 10px;
    position: relative;
}
.nav_live_six{
    width: 60px;
    height: 60px;
    float: left;
    margin: auto;
    background-image: url(../img/直播-小阿KK.jpg);
    background-size: 60px 60px;
    border-radius: 100%;
    margin: 10px 0px 0px 10px;
    position: relative;
}
.nav_live_line{
    width: 1px;
    height: 180px;
    float: left;
    margin: 25px 0px 0px 5px;
    background-color: rgb(196, 182, 181);
}
.nav_live_right{
    width: 210px;
    height: 220px;
    float: left;
}
.nav_live_r_span{
    display: block;
    float: left;
    font-size: 14px;
    font-weight: 600;
    color: #fb7299;
    margin-top: 5px;
    margin-left: 15px;
}
.nav_live_rp{
    width: 190px;
    height: 100px;
    float: left;
    padding: 10px 13px;
}
.nav_live_r_pic{
    width: 190px;
    height: 100px;
    float: left;
    margin-top: 0px;
    margin-left: -3px;
    background-image: url(../img/热门活动.jpg);
    background-size: 190px 100px;
}
.nav_live_rp:hover{
    background-color: rgba(0, 0, 0, 0.1);
}
/* 导航漫画 */
.comic_left{
    width: 320px;
    height: 230px;
    float: left;
    cursor: pointer;
}
.comic_left_box{
    width: 150px;
    height: 100px;
    float: left;
    padding: 10px 5px 5px 5px;
}
.comic_left_box:hover{
    background-color: rgba(0, 0, 0, 0.1);
}
.comic_left_zu{
    width: 150px;
    height: 80px;
    float: left;
    background-image: url(../img/漫画-1.jpg);
    background-size: 150px 80px;
}
.comic_left_name{
    width: 100px;
    height: 20px;
    display: block;
    font-size: 12px;
    color: #333;
    text-align: left;
    line-height: 20px;
}
.comic_left_dao{
    width: 150px;
    height: 80px;
    float: left;
    background-image: url(../img/漫画-刀剑神域.jpg);
    background-size: 150px 80px;
}
.comic_left_tian{
    width: 150px;
    height: 80px;
    float: left;
    background-image: url(../img/漫画-天赐官福.jpg);
    background-size: 150px 80px;
}
.comic_left_xian{
    width: 150px;
    height: 80px;
    float: left;
    background-image: url(../img/漫画-仙王.jpg);
    background-size: 150px 80px;
}
.comic_line{
    width: 1px;
    height: 210px;
    float: left;
    margin: 10px 0px 0px 0px;
    background-color: rgb(196, 182, 181);
}
/* 漫画二级导航右边 */
.comic_right{
    width: 169px;
    height: 230px;
    float: left;
}
.comic_right_name{
    width: 100px;
    height: 30px;
    float: left;
    font-size: 14px;
    font-weight: 600;
    color: #fb7299;
    margin-left: -5px;
}
.comic_right_li{
    width: 169px;
    height: 30px;
    float: left;
    position: relative;
    cursor: pointer;
}
.comic_right_li:hover {
    background-color: #E7E7E7;
}
.comic_right_id{
    width: 10px;
    height: 30px;
    display: block;
    float: left;
    font-size: 12px;
    color: #ebcfac;
    margin-left: 15px;
}
.comic_right_span{
    width: 120px;
    height: 30px;
    display: inline-block;
    font-size: 12px;
    color: #333;
    margin-left: 5px;
}
.comic_right_span span{
    float: left;
}
.comic_right_shu{
    position: absolute;
    width: 150px;
    height: 200px;
    float: left;
    background-image: url(../img/漫画-6-咒术.jpg);
    background-size: 150px 200px;
    margin: 0px 0px 0px 115px;
    border-radius: 5px;
    display: none;
}
.comic_right_li:hover .comic_right_shu{
    display: block;
}
.comic_right_tian{
    position: absolute;
    width: 150px;
    height: 200px;
    float: left;
    background-image: url(../img/漫画-5-天赐官福.jpg);
    background-size: 150px 200px;
    margin: -30px 0px 0px 115px;
    border-radius: 5px;
    display: none;
}
.comic_right_li:hover .comic_right_tian{
    display: block;
}
.comic_right_fei{
    position: absolute;
    width: 150px;
    height: 200px;
    float: left;
    background-image: url(../img/妹子太多.jpg@320w);
    background-size: 150px 200px;
    margin: -60px 0px 0px 115px;
    border-radius: 5px;
    display: none;
}
.comic_right_li:hover .comic_right_fei{
    display: block;
}
.comic_right_yu{
    position: absolute;
    width: 150px;
    height: 200px;
    float: left;
    background-image: url(../img/漫画-4.jpg);
    background-size: 150px 200px;
    margin: -90px 0px 0px 115px;
    border-radius: 5px;
    display: none;
}
.comic_right_li:hover .comic_right_yu{
    display: block;
}
.comic_right_bi{
    position: absolute;
    width: 150px;
    height: 200px;
    float: left;
    background-image: url(../img/碧蓝.jpg@320w);
    background-size: 150px 200px;
    margin: -120px 0px 0px 115px;
    border-radius: 5px;
    display: none;
}
.comic_right_li:hover .comic_right_bi{
    display: block;
}
.comic_right_fan{
    position: absolute;
    width: 150px;
    height: 200px;
    float: left;
    background-image: url(../img/反派.jpg@320w);
    background-size: 150px 200px;
    margin: -150px 0px 0px 115px;
    border-radius: 5px;
    display: none;
}
.comic_right_li:hover .comic_right_fan{
    display: block;
}
/* APP下载扫码 */
/* nav-手机标示图 */
.icon_download{
    width: 18px;
    height: 18px;
    float: left;
    font-size: 18px;
    margin: 1px -3px 0px 5px;
    color: #fff;
    cursor: pointer;
}
.download_pic{
    position: absolute;
    top: -3px;
    left: -68px;
    width: 260px;
    height: 200px;
    float: left;
    background-image: url(../img/app-download.png);
    background-size: 260px 200px;
}
.download_pic_words{
    width: 130px;
    height: 30px;
    display: inline-block;
    font-size: 14px;
    color: #666;
    line-height: 30px;
    text-align: center;
    margin: 160px 0px 0px 15px;
}
/* nav-中间搜索input框 */
.nav-middle{
    width: 360px;
    height: 36px;
    float: left;
    background-color: #fff;
    margin-left: 20px;
    position: relative;
}
.nav-input > input{
    position: absolute;
    width: 270px;
    height: 30px;
    float: left;
    margin: 3px 0px 0px 20px;
    color: #999;
    font-size: 14px;
    line-height: 30px;
    overflow: hidden;
    border: none;
    background-color: transparent;
}
.nav-input > input:focus{
    outline: none;
}
.nav-search{
    width: 50px;
    height: 36px;
    float: right;
    background-color: #E7E7E7;
}
/* 搜索标示图 */
.icon_search{
    position: absolute;
    width: 18px;
    height: 18px;
    float: left;
    font-size: 18px;
    font-weight: 700;
    margin: 7px -8px 0px 15px;
    color: #505050;
    cursor: pointer;
}
.icon_search:hover{
    color: #00a1d6;
}
/* nav-登录 */
.nav-login{
    width: 36px;
    height: 36px;
    float: left;
    font-size: 14px;
    color: #00a1d6;
    line-height: 36px;
    text-align: center;
    font-weight: 600;
    background-color: #f6f6f6;
    margin-left: 20px;
    border-radius: 50%;
    position: relative;
    cursor: pointer;
}
.nav-login a{
    color: #00a1d6;
}
.nav-login_box{
    position: absolute;
    top: 43px;
    left: -160px;
    width: 360px;
    height: 210px;
    background-color: #fff;
    box-shadow: 1px 1px 1px 1px #999;
    display: none;
}
.nav-login_san{
    position: absolute;
    width: 0;
    height: 0;
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    margin-top: -8px;
    margin-left: 170px;
}
.nav-login_inform{
    position: absolute;
    top: 3px;
    left: 10px;
    width: 100px;
    height: 30px;
    display: inline-block;
    font-size: 14px;
    color: #666;
}
/* 免费看高清视频 */
.nav-login_free{
    position: absolute;
    top: 40px;
    left: 10px;
    width: 150px;
    height: 30px;
    float: left;
}
/* 登录下的标示图 */
.icon_hd{
    width: 18px;
    height: 18px;
    display: block;
    float: left;
    font-size: 20px;
    font-weight: 700;
    color: #00a1d6;
    margin: -2px -5px 0px 10px;
}
.nav-login_free_words{
    width: 130px;
    height: 30px;
    float: left;
    font-size: 14px;
    font-weight: 700;
    color: #505050;
    margin: -18px 0px 0px 23px;
}
/*  发表弹幕/评论*/
.nav-login_fa{
    position: absolute;
    top: 80px;
    left: 10px;
    width: 150px;
    height: 30px;
    float: left;
}
/* 多端同步播放记录 */
.nav-login_duo{
    position: absolute;
    top: 40px;
    left: 190px;
    width: 150px;
    height: 30px;
    float: left;
}
/* 热门番剧影视看不停 */
.nav-login_hot{
    position: absolute;
    top: 80px;
    left: 190px;
    width: 160px;
    height: 30px;
    float: left;
}
/* 导航-立即登录 */
.nav-login_at{
    position: absolute;
    top: 120px;
    left: 15px;
    width: 330px;
    height: 40px;
    float: left;
    background-color: #00a1d6;
    font-size: 14px;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
}
.nav-login_at a{
    color: #fff;
}
.nav-login_at:hover{
    background-color: #78b1c4;
    transition: all 0.5s;
}
/* 点我注册 */
.nav-login_foot{
    width: 120px;
    height: 25px;
    float: left;
    font-size: 14px;
    line-height: 25px;
    margin: 170px 0px 0px 123px;
}
.nav-login_foot_shi{
    width: 63px;
    height: 25px;
    float: left;
    color: #505050;
}
.nav-login_foot_dian > a{
    width: 57px;
    height: 25px;
    float: left;
    color: #00a1d6;
    cursor: pointer;
}
.nav-login:hover .nav-login_box{
    display: block;
    transition: all .5s;
}
.nav-4{
    width: 300px;
    height: 36px;
    float: left;
    color: #fff;
    margin: 0px 0px 0px 20px;
}
.nav-41{
    width: 42px;
    height: 16px;
    float: left;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    cursor: pointer;
    position: relative;
    padding: 10px 0px;
}
.nav-41-1{
    position: absolute;
    top: 36px;
    left: -100px;
    width: 250px;
    height: 225px;
    float: left;
    background-color: #fff;
    box-shadow: 1px 1px 1px 1px #999;
    border-radius: 2px;
    display: none;
}
.san-2{
    position: absolute;
    width: 0;
    height: 0;
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    margin-top: -8px;
    margin-left: 113px;
}
.nav-41-2{
    width: 100px;
    height: 20px;
    float: left;
    font-size: 14px;
    color: #333;
    line-height: 20px;
    margin: 20px 0px 0px -10px;
}
.nav-41-3{
    width: 230px;
    height: 68px;
    float: left;
    background-image: url(../img/1.jpg);
    background-size: 230px 68px;
    margin: 10px 0px 0px 10px;
}
.nav-41-4{
    width: 250px;
    height: 40px;
    float: left;
    font-size: 14px;
    color: #333;
    line-height: 20px;
    text-align: left;
    margin: 10px 0px 0px 10px;
}
.nav-41-4:hover{
    color: #00a1d6;
}
.nav-41-5{
    width: 200px;
    height: 30px;
    float: left;
    margin: 15px 0px 0px 25px;
    font-size: 14px;
    color: #fff;
    line-height: 30px;
    text-align: center;
    background-color: #00a1d6;
    border-radius: 5px;
    cursor: pointer;
}
.nav-41-5:hover{
    background-color: #78b1c4;
    transition: all .5s;
}
.nav-41:hover .nav-41-1{
    display: block;
    transition: all .5s;
}
.nav-42{
    width: 28px;
    height: 16px;
    float: left;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    margin: 0px 0px 0px 10px;
    cursor: pointer;
    position: relative;
    padding: 10px 0px;
}
.nav-42-1{
    position: absolute;
    top: 36px;
    left: -136px;
    width: 300px;
    height: 100px;
    float: left;
    background-color: #fff;
    border-radius: 2px;
    display: none;
    box-shadow: 1px 1px 1px 1px #999;
}
.san-3{
    position: absolute;
    width: 0;
    height: 0;
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    margin-top: -8px;
    margin-left: 145px;
}
.nav-42-2{
    width: 180px;
    height: 30px;
    display: inline-block;
    font-size: 14px;
    color: #999;
    text-align: center;
    line-height: 30px;
    margin: 15px 0px 0px 15px;
}
.nav-42-3{
    width: 200px;
    height: 30px;
    float: left;
    font-size: 14px;
    color: #333;
    text-align: center;
    line-height: 30px;
    margin: 15px 0px 0px 58px;
    background-color: #00a1d6;
}
.nav-42-3:hover{
    background-color: #78b1c4;
    transition: all .5s;
}
.nav-42:hover .nav-42-1{
    display: block;
    transition: all .5s;
}
.nav-43{
    width: 56px;
    height: 16px;
    float: left;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    margin: 0px 0px 0px 10px;
    cursor: pointer;
    position: relative;
    padding: 10px 0px;
}
.nav-43-1{
    position: absolute;
    top: 36px;
    left: -136px;
    width: 300px;
    height: 100px;
    float: left;
    background-color: #fff;
    border-radius: 2px;
    display: none;
    box-shadow: 1px 1px 1px 1px #999;
}
.nav-43:hover .nav-43-1{
    display: block;
    transition: all .5s;
}
.nav-5{
    width: 100px;
    height: 36px;
    float: left;
    background-color: #fb7299;
    margin: 0px 0px 0px 20px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    line-height: 36px;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
}
.nav-51{
    position: absolute;
    top: 42px;
    right: -15px;
    width: 380px;
    height: 78px;
    float: left;
    background-color: #fff;
    border-radius: 2px;
    display: none;
    box-shadow: 1px 1px 1px 1px #999;
}
.san-4{
    position: absolute;
    width: 0;
    height: 0;
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    margin-top: -8px;
    margin-left: 305px;
}
.nav-52{
    width: 76px;
    height: 78px;
    float: left;
}
.nav-52-1{
    width: 50px;
    height: 36px;
    float: left;
    margin: 10px 0px 0px 13px;
}
.nav-52-2{
    width: 76px;
    height: 20px;
    float: left;
    font-size: 14px;
    color: #999;
    text-align: center;
    line-height: 20px;
    font-weight: 600;
}
.nav-52:hover{
    background-color: #E7E7E7;
    transition: all .5s;
}
.nav-5:hover .nav-51{
    display: block;
}
.bili-logo{
    width: 163px;
    height: 78px;
    float: left;
    background-image: url(../img/bilibili-logo.png);
    background-size: 163px 78px;
    position: absolute;
    top: 60px;
    left: 155px;
    z-index: 1;
}
/* 主菜单列 */
.primary-menu{
    width: 100%;
    height: 108px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}
.head{
    width: 1164px;
    height: 88px;
    padding: 20px 0px;
}
.head-1{
    width: 200px;
    height: 68px;
    float: left;
}
.head-11{
    width: 50px;
    height: 68px;
    float: left;
    position: relative;
    cursor: pointer;
}
.icon-1{
    position: absolute;
    width: 36px;
    height: 36px;
    background-color: #ff5c7c;
    border-radius: 100%;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    line-height: 36px;
    margin: 0px 6px 4px;
}
.head-11-1{
    width: 50px;
    height: 30px;
    display: inline-block;
    font-size: 14px;
    color: #212121;
    text-align: center;
    line-height: 30px;
    margin: 35px 0px 0px 0px;
}
.head-11:hover .head-11-1{
    color: #73C9E5;
    transition: all 0.5s;
}
.icon-2{
    position: absolute;
    width: 36px;
    height: 36px;
    background-color: #FCBA2A;
    border-radius: 100%;
    font-size: 28px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    line-height: 36px;
    margin: 0px 6px 4px;
}
.icon-3{
    position: absolute;
    width: 36px;
    height: 36px;
    background-color: #FF716D;
    border-radius: 100%;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    line-height: 36px;
    margin: 0px 6px 4px;
}
.icon-4{
    position: absolute;
    width: 36px;
    height: 36px;
    background-color: #6DC781;
    border-radius: 100%;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    line-height: 36px;
    margin: 0px 6px 4px;
}
.line-1{
    width: 1px;
    height: 46px;
    background-color: #e7e7e7;
    float: left;
    margin: 10px 8px;
}
.head-2{
    width: 710px;
    height: 68px;
    float: left;
}
.head-21{
    width: 61px;
    height: 19px;
    float: left;
    padding: 5px 2.8px;
    cursor: pointer;
}
.head-21-1{
    width: 30px;
    height: 19px;
    display: inline-block;
    font-size: 14px;
    color: #212121;
    line-height: 19px;
}
.head-21-2{
    width: 28px;
    height: 12px;
    float: right;
    font-size: 12px;
    color: #fff;
    background-color: #73c9e5;
    border-radius: 2px;
    margin: 5px 0px 0px 1px;
    text-align: center;
    line-height: 12px;
}
.head-21:hover .head-21-1,.head-212:hover .head-21-12{
    color: #73c9e5;
}
.head-22{
    width: 160px;
    height: 145px;
    float: left;
    background-color: #fff;
    box-shadow: 1px 1px 1px #999;
    border-radius: 3px;
    border-bottom: 2px;
    position: relative;
    top: 8px;
    display: none;
}
.jiao-5{
    position: absolute;
    width: 0;
    height: 0;
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    margin-top: -8px;
    margin-left: 0px;
}
.head-22-1{
    width: 100px;
    height: 30px;
    float: left;
    font-size: 12px;
    color: #333;
    margin-left: 5px;
    margin-top: 5px;
    line-height: 30px;
}
.head-22-2{
    width: 48px;
    height: 30px;
    float: left;
    font-size: 12px;
    color: #333;
    line-height: 30px;
    margin: 0px 0px 0px 5px;
}
.head-22-1>li:hover,.head-22-2>li:hover,.head-27>li:hover{
    color: #73c9e5;
}
.head-21:hover .head-22{
    display: block;
}
.head-211{
    width: 75px;
    height: 19px;
    float: left;
    padding: 5px 3px;
    cursor: pointer;
}
.head-21-11{
    width: 43px;
    height: 19px;
    display: inline-block;
    font-size: 14px;
    color: #212121;
    line-height: 19px;
}
.head-212{
    width: 89px;
    height: 19px;
    float: left;
    padding: 5px 3px;
    cursor: pointer;
}
.head-21-12{
    width: 56px;
    height: 19px;
    display: inline-block;
    font-size: 14px;
    color: #212121;
    line-height: 19px;
}
.head-23{
    width: 230px;
    height: 120px;
    float: left;
    background-color: #fff;
    box-shadow: 1px 1px 1px #999;
    border-radius: 3px;
    border-bottom: 2px;
    position: relative;
    top: 8px;
    display: none;
}
.head-24{
    width: 90px;
    height: 120px;
    line-height: 30px;
    font-size: 12px;
    color: #333;
    float: left;
    margin-left: 5px;
}
.head-25{
    width: 50px;
    height: 120px;
    line-height: 30px;
    font-size: 12px;
    color: #333;
    float: left;
    margin-left: 30px;
}
.head-26{
    width: 30px;
    height: 120px;
    line-height: 30px;
    font-size: 12px;
    color: #333;
    float: left;
    margin-left: 20px;
}
.head-24>li:hover,.head-25>li:hover,.head-26>li:hover,.head-21-11:hover{
    color: #73c9e5;
}
.head-21:hover .head-23{
    display: block;
}
.head-221{
    width: 60px;
    height: 120px;
    float: left;
    background-color: #fff;
    box-shadow: 1px 1px 1px #999;
    border-radius: 3px;
    border-bottom: 2px;
    position: relative;
    top: 8px;
    display: none;
}
.head-2211{
    width: 60px;
    height: 60px;
    float: left;
    background-color: #fff;
    box-shadow: 1px 1px 1px #999;
    border-radius: 3px;
    border-bottom: 2px;
    position: relative;
    top: 8px;
    display: none;
}
.head-2212{
    width: 60px;
    height: 75px;
    float: left;
    background-color: #fff;
    box-shadow: 1px 1px 1px #999;
    border-radius: 3px;
    border-bottom: 2px;
    position: relative;
    top: 8px;
    display: none;
}
.head-21:hover .head-2211,.head-211:hover .head-2212{
    display: block;
}
.head-22-3{
    width: 50px;
    height: 25px;
    float: left;
    font-size: 12px;
    color: #333;
    margin-left: 5px;
    margin-top: 3px;
    line-height: 25px;
}
.head-22-3:hover{
    color: #73c9e5;
}
.head-21:hover .head-221,.head-211:hover .head-221{
    display: block;
}
.head-27{
    width: 55px;
    height: 120px;
    line-height: 30px;
    font-size: 12px;
    color: #333;
    float: left;
    margin-left: 20px;
}
.head-3{
    width: 220px;
    height: 68px;
    float: left;
}
.head-31{
    width: 65px;
    height: 30px;
    float: left;
    cursor: pointer;
    padding: 2px 1px;
}
.icon-11{
    width: 20px;
    height: 25px;
    font-size: 16px;
    color: #73c9e5;
    font-weight: 600;
}
.head-31-1{
    width: 28px;
    height: 25px;
    color: #212121;
    font-size: 14px;
}
.head-32{
    width: 72px;
    height: 30px;
    float: left;
    cursor: pointer;
    padding: 2px 0px;
}
.head-33{
    width: 85px;
    height: 30px;
    float: left;
    cursor: pointer;
    padding: 2px 0px;
}
.head-31-1:hover{
    color: #73c9e5;
}
.icon-12{
    width: 25px;
    height: 25px;
    font-size: 16px;
    color: #F39800;
    font-weight: 600;
}
.wrap{
    width: 100%;
    height: 242px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 0;
}
.wrap_tu{
    width: 1164px;
    height: 242px;
}
.tu-left{
    position: relative;
    width: 550px;
    height: 242px;
    float: left;
    border-radius: 3px;
    cursor: pointer;
    overflow: hidden;
}
.wrap-left-pic{
    width: 1100px;
    float: left;
    position: relative;
}
.wrap-left-pic a{
    width: 550px;
    height: 242px;
    position: absolute;
    transition: transform 500ms;
}
.wrap-left-pic a img{
    width: 550px;
    display: block;
    position: absolute;
}
.wrap-left-pic a p {
    position: absolute;
    bottom: 0px;
    left: 10px;
    width: 150px;
    z-index: 99;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    line-height: 45px;
}
.wrap_left_more{
    width: 70px;
    height: 30px;
    float: right;
    background-color: rgb(0,0,0,0.5);
    text-align: center;
    color: #fff;
    line-height: 30px;
    border-radius: 3px;
    position: absolute;
    bottom: 40px;
    right: 25px;
    z-index: 10;
    cursor: pointer;
    display: none;
}
.wrap_left_more span{
    color: #fff;
}
.icon-more{
    position: absolute;
    width: 20px;
    height: 30px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    line-height: 30px;
    margin: 0px -3px 0px;
}
.tu-left:hover .wrap_left_more{
    display: block;
}
.wrap_left_down {
    width: 100px;
    height: 40px;
    position: absolute;
    bottom: 0px;
    right: 5px;
}
.wrap_left_down span{
    display: block;
    width: 10px;
    height: 10px;
    box-sizing: border-box;
    background-color: #f6f6f6;
    border-radius: 10px;
    float: left;
    margin: 13px 10px 0px 0px;
    cursor: pointer;
}
.wrap_left_down span:hover{
    background-color: #01A1D6;
    border: 2px solid #fff;
    transform: scale(1.3);
}
.wrap_left_downOn{
    background-image: url(../img/鱼头.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-color: transparent;
    border-width: 0;
    transition-property: transform;
    transition-duration: 250ms;
    transform: scale(2);
} 
.tu-right{
    width: 600px;
    height: 242px;
    float: right;
    cursor: pointer;
    position: relative;
    z-index: 0;
}
.right-1{
    width: 600px;
    height: 116px;
    float: left;
}
.right-11{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/tu-right-1.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 0;
    overflow: hidden;
    cursor: pointer;
}
.right-12{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/tu-right-2.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 15px;
    overflow: hidden;
    cursor: pointer;
}
.right-13{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/tu-right-3.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 30px;
    overflow: hidden;
    cursor: pointer;
}
.right-11-1{
    width: 190px;
    height: 116px;
    float: left;
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    bottom: -90px;
}
.right-yan{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/wrap-right-1.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 0;
    overflow: hidden;
    cursor: pointer;
}
.right-11:hover .right-11-1,.right-12:hover .right-11-1,.right-13:hover .right-11-1{
    transform: translateY(-90px);
    transition: all 0.5s;
}
.right-yan:hover .right-11-1{
    transform: translateY(-90px);
    transition: all .5s;
}
.right-A{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/wrap-right-5.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 30px;
    overflow: hidden;
    cursor: pointer;
}
.right-A:hover .right-11-1{
    transform: translateY(-90px);
    transition: all .5s;
}
.right-gao{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/wrap-right-2.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 0;
    overflow: hidden;
    cursor: pointer;
}
.right-gao:hover .right-11-1{
    transform: translateY(-90px);
    transition: all .5s;
}
.right-lemon{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/wrap-right-3.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 15px;
    overflow: hidden;
    cursor: pointer;
}
.right-lemon:hover .right-11-1{
    transform: translateY(-90px);
    transition: all .5s;
}
.right-ta{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/wrap-right-4.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 15px;
    overflow: hidden;
    cursor: pointer;
}
.right-ta:hover .right-11-1{
    transform: translateY(-90px);
    transition: all .5s;
}
.right-11-11{
    width: 190px;
    height: 18px;
    float: left;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    margin-top: 5px;
    text-align: center;
    line-height: 18px;
    letter-spacing: 2px;
    text-overflow: ellipsis;
}
.right-11-12{
    width: 120px;
    height: 50px;
    float: left;
    margin-top: 48px;
}
.right-11-12-1{
    width: 15px;
    height: 15px;
    float: left;
    border: 1px solid #fff;
    font-size: 12px;
    color: #fff;
    border-radius: 3px;
    margin: 3px 0px 0px 5px;
    text-align: center;
    line-height: 15px;
    /* transform: scale(0.8); */
}
.right-11-12-2{
    width: 60px;
    height: 15px;
    float: left;
    font-size: 12px;
    color: #fff;
    text-align: center;
    line-height: 15px;
    margin: 5px 0px 0px 5px;
}
.right-11-12-3{
    width: 100px;
    height: 20px;
    display: inline-block;
    font-size: 12px;
    color: #fff;
    line-height: 20px;
    margin: 5px 0px 0px 5px;
}
.right-11-13{
    width: 30px;
    height: 30px;
    float: left;
    margin: 58px 0px 0px 30px;
    background-image: url(../img/播放键.png);
    background-size: 30px 30px;
    border-radius: 3px;
    text-align: center;
}
.right-2{
    width: 600px;
    height: 116px;
    float: left;
    margin-top: 10px;
}
.right-21{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/tu-right-4.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 0;
    overflow: hidden;
    cursor: pointer;
}
.right-22{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/tu-right-5.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 15px;
    overflow: hidden;
    cursor: pointer;
}
.right-23{
    width: 190px;
    height: 116px;
    float: left;
    background-image: url(../img/tu-right-6.jpg);
    background-size: 190px 116px;
    border-radius: 3px;
    position: relative;
    top: 0;
    left: 30px;
    overflow: hidden;
    cursor: pointer;
}
.right-21:hover .right-11-1,.right-22:hover .right-11-1,.right-23:hover .right-11-1{
    transform: translateY(-90px);
    transition: all 0.5s;
}
/* 右边轮波图 */
.wrap_right{
    position: absolute;
    display: none;
}
.wrap_btn{
    position: relative;
}
.wrap_btn img{
    display: block;
    position: absolute;
    top: 93px;
    cursor: pointer;
    width: 50px;
    height: 57px;
    background-color: rgba(0, 0, 0, 0.3); 
    display: none;
}
.tu-right:hover .wrap_btn img{
    display: block;
}
.wrap_btn img:hover{
    transform: scale(1.1);
    transition: all .3s;
}
#wrap_btn_left{
    left: 2px;
}
#wrap_btn_right{
    right: 2px;
}
.tu-right:hover .tu-right-1,.tu-right:hover .tu-right-2{
    display: block;
}
.promote{
    width: 100%;
    height: 224px;
    position: relative;
    top: 40px;
    left: 0;
}
.gao{
    width: 1164px;
    height: 224px;
    position: absolute;
}
.gao-1{
    width: 1164px;
    height: 36px;
    margin: 0px 0px 6px;
}
/* .gao-11{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/喇叭.jpg);
    background-size: 36px 36px;
    margin: 0px 6px 0px 0px;
} */
#bili-tuiguang{
    width: 36px;
    height: 36px;
    float: left;
}
.gao-12{
    width: 40px;
    height: 36px;
    float: left;
    font-size: 20px;
    color: #212121;
    line-height: 36px;
    margin: 0px 20px 0px 0px;
}
.gao-13{
    width: 150px;
    height: 36px;
    float: left;
    cursor: pointer;
}
.icon-14{
    width: 20px;
    height: 16px;
    display: inline-block;
    font-size: 20px;
    color: #f0361b;
    margin-top: 10px;
}
.gao-14{
    width: 100px;
    height: 36px;
    display: inline-block;
    font-size: 12px;
    color: #212121;
    line-height: 36px;
    margin: 0px 20px 0px 0px;
}
.gao-14:hover{
    color: #73c9e5;
}
.gao-15{
    width: 263px;
    height: 30px;
    float: right;
    background-color: rgb(216, 212, 212);
    cursor: pointer;
    font-size: 12px;
    color: #212121;
    text-align: center;
    line-height: 30px;
    margin-top: 3px;
}
.gao-15:hover{
    color: #00a1d6;
    transition: color .3s;
}
.gao-2{
    width: 1164px;
    height: 172px;
    cursor: pointer;
}
.gao-21{
    width: 170px;
    height: 172px;
    float: left;
}
.guang-1{
    width: 190px;
    height: 96px;
    background-image: url(../img/广告-1.jpg);
    background-size: 170px 96px;
    border-radius: 3px;
}
.gao-21-1{
    width: 170px;
    height: 50px;
    font-size: 12px;
    margin-top: 10px;
    cursor: pointer;
}
.gao-21-11{
    width: 30px;
    height: 15px;
    border: 1px solid #fff;
    border-radius: 3px;
}
.gao-21-12{
    width: 140px;
    height: 30px;
    font-size: 14px;
    color: #212121;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gao-21-1>span:hover{
    color: #00a1d6;
    transition: color 0.5s;
}
.gao-22{
    width: 60px;
    height: 15px;
    float: left;
    font-size: 12px;
    color: #E7E7E7;
    line-height: 15px;
}
.gao-23{
    width: 170px;
    height: 172px;
    float: left;
    margin: 0px 0px 0px 40px;
}
.guang-2{
    width: 190px;
    height: 96px;
    background-image: url(../img/guang-2.jpg@412w_232h_1c);
    background-size: 170px 96px;
    border-radius: 3px;
}
.guang-3{
    width: 190px;
    height: 96px;
    background-image: url(../img/guang-4.jpg@412w_232h_1c);
    background-size: 170px 96px;
    border-radius: 3px;
}
.guang-4{
    width: 190px;
    height: 96px;
    background-image: url(../img/guang-3.png@412w_232h_1c);
    background-size: 170px 96px;
    border-radius: 3px;
}
.gao-3{
    width: 265px;
    height: 153px;
    float: right;
    background-image: url(../img/深度解析.jpg);
    background-size: 265px 153px;
}
.adv{
    width: 100%;
    height: 83px;  
    margin-top: 50px;
}
.gao-up{
    width: 1164px;
    height: 83px;
    background-image: url(../img/11.jpg);
    background-size: 1164px 83px;
    cursor: pointer;
}
.gao-up-words{
    width: 38px;
    height: 20px;
    float: left;
    font-size: 12px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    background-color: rgba(0, 0, 0, 0.1);
    border: 1px solid #999;
    margin: 55px 0px 0px 10px;
}
.live{
    width: 100%;
    height: 360px;  
}
.live .zhibo{
    width: 1164px;
    height: 360px;
    margin-top: 30px;
}
.zhibo-1{
    width: 856px;
    height: 36px;
}
.zhibo-11{
    width: 270px;
    height: 36px;
    float: left;
}

#bili-live {
    width: 28px;
    height: 26px;
    float: left;
    margin-top: 5px;
}
.zhibo-11-2{
    width: 80px;
    height: 36px;
    float: left;
    font-size: 18px;
    color: #212121;
    line-height: 36px;
    margin: 0px 0px 0px 5px;
    cursor: pointer;
}
.zhibo-11-2:hover{
    color: #00a1d6;
}
.zhibo-11-3{
    width: 140px;
    height: 36px;
    float: left;
    font-size: 12px;
    color: #999;
    line-height: 40px;
    margin: 0px 0px 0px 5px;
}
.zhibo-12{
    width: 400px;
    height: 36px;
    float: right;
    margin-right: 70px;
}
.zhibo-12-1{
    width: 75px;
    height: 22px;
    float: left;
    border: 1px solid #999;
    margin-top: 5px;
    color: #505050;
    cursor: pointer;
    border-radius: 2px;
}
/*换一换图标样式 */
.icon-15{
    width: 16px;
    height: 16px;
    display: inline-block;
    font-size: 16px;
    margin-left: 5px;
    
    animation-name: huan;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: 28;
    animation-play-state: paused;
}
.zhibo-12-1:hover .icon-15{
    animation-play-state: running;
}
@keyframes huan{
    0% {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }

    100% {
        transform: rotate(1turn);
        -webkit-transform: rotate(1turn);
    }
}
.zhibo-huan{
    width: 147px;
    height: 36px;
    float: right;
    margin-right: 5px;
}
.zhibo-12-11{
    width: 36px;
    height: 12px;
    display: inline-block;
    font-size: 12px;
    line-height: 22px;
}
.zhibo-12-1:hover{
    background-color: #e7e7e7;
}
.zhibo-12-2{
    width: 58px;
    height: 22px;
    float: left;
    border: 1px solid #999;
    margin: 5px 0px 0px 10px;
    border-radius: 2px;
    color: #505050;
    cursor: pointer;
}
.zhibo-12-21{
    width: 24px;
    height: 12px;
    display: inline-block;
    font-size: 12px;
    line-height: 12px;
    text-align: center;
    margin: -3px 0px 0px 10px;
}
.icon-16{
    width: 16px;
    height: 16px;
    display: inline-block;
    font-size: 16px;
    text-align: center;
}
.zhibo-12-2:hover{
    background-color: #e7e7e7;
}

/* 直播内容 */
.live-content{
    width: 856px;
    height: 375px;
    margin-top: 15px;
    float: left;
}
.live-con-left{
    width: 856px;
    height: 375px;
    float: left;
}
.zhibo-21-1{
    width: 206px;
    height: 190px;
    float: left;
}
.zhibo-21-11{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/zhibo-2.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-11:hover{
    background-image: url(../img/zhibo-2-1.jpg);
    transition: all 0.5s;
}
.zhibo-21-11-1{
    width: 206px;
    height: 20px;
    margin-top: 96px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.2);
}
.icon-17{
    width: 16px;
    height: 16px;
    display: inline-block;
    font-size: 18px;
    text-align: center;
    margin: 0px 0px 0px 10px;
}
.zhibo-21-11-11{
    width: 36px;
    height: 15px;
    display: inline-block;
    font-size: 12px;
    line-height: 15px;
}
.zhibo-21-12{
    width: 206px;
    height: 64px;
    float: left;
    cursor: pointer; 
    margin-top: 5px; 
}
.zhibo-21-12-1{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21.webp);
    background-size: 36px 36px;
    border-radius: 36px;
}
.zhibo-21-12-2{
    width: 128px;
    height: 64px;
    float: left;
    cursor: pointer;
}
.zhibo-21-12-21{
    width: 128px;
    height: 20px;
    float: left;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    margin-left: 5px;
}
.zhibo-21-12-21:hover{
    color: #00a1d6;
}
.zhibo-21-12-22{
    width: 128px;
    height: 18px;
    float: left;
    font-size: 12px;
    line-height: 18px;
    color: #505050;
    font-weight: 500;
    margin-top: 2px;
    margin-left: 5px;
}
.zhibo-21-12-23{
    width: 128px;
    height: 18px;
    float: left;
    font-size: 12px;
    line-height: 16px;
    color: #999;
    margin-top: 8px;
    margin-left: 5px;
}
.zhibo-21-2{
    width: 206px;
    height: 190px;
    float: left;
    margin-left: 10px;
}
.zhibo-21-21{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/zhibo-22.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-21:hover{
    background-image: url(../img/zhibo-2-2.jpg);
    transition: all 0.5s;
}
.zhibo-21-12-3{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21-1.webp);
    background-size: 36px 36px;
    border-radius: 36px;
}
.zhibo-21-22{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/hibo-23.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-22:hover{
    background-image: url(../img/zhibo-2-3.jpg);
    transition: all 0.5s;
}
.zhibo-21-12-4{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21-2.webp);
    background-size: 36px 36px;
    border-radius: 36px;
}
.zhibo-21-23{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/zhibo-24.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-23:hover{
    background-image: url(../img/zhibo-2-3.jpg);
    transition: all 0.5s;
}
.zhibo-21-12-5{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21-3.webp);
    background-size: 36px 36px;
    border-radius: 36px;
}
.zhibo-21-24{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/zhibo-25.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-24:hover{
    background-image: url(../img/zhibo-2-4.jpg);
    transition: all 0.5s;
}
.zhibo-21-12-6{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21-4.jpg);
    background-size: 36px 36px;
    border-radius: 36px;
}
.zhibo-21-25{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/zhibo-26.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-25:hover{
    background-image: url(../img/zhibo-2-5.jpg);
    transition: all 0.5s;
}
.zhibo-21-12-7{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21-5.webp);
    background-size: 36px 36px;
    border-radius: 36px;
}
.zhibo-21-26{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/zhibo-27.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-26:hover{
    background-image: url(../img/zhibo-2-6.jpg);
    transition: all 0.5s;
}
.zhibo-21-12-8{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21-6.webp);
    background-size: 36px 36px;
    border-radius: 36px;
}
.zhibo-21-27{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/zhob-28.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.zhibo-21-27:hover{
    background-image: url(../img/zhibo-2-7.jpg);
    transition: all 0.5s;
}
.zhibo-21-12-9{
    width: 36px;
    height: 36px;
    float: left;
    background-image: url(../img/zhibo-21-7.webp);
    background-size: 36px 36px;
    border-radius: 36px;
}
.live-con-right{
    position: relative;
    top: -37px;
    width: 265px;
    height: 360px;
    float: right;
    border-radius: 2px;
    cursor: pointer;
    overflow: hidden;
}
.live-rh {
    width: inherit;
    height: 36px;
    float: left;
    margin-bottom: 15px;
}
.live-rh span{
    float: left;
    margin: 10px 0px 0px 10px;
    font-size: 12px;
    color: #505050;
}
.live-rh .live-rhOn{
    border-bottom: 1px solid #73c9e5;
    color: #73c9e5;
}
.live-a{
    width: 530px;
    height: 273px;
    float: left;
    position: relative;
}
.live-a a{
    width: 303px;
    height: inherit;
    display: block;
    float: left;
    position: absolute;
    transition: transform 500ms;
}
.live-a a img{
    width: 303px;
    position: absolute;
}
.live-a a p{
    position: absolute;
    bottom: -29px;
    left: 5px;
    width: 122px;
    z-index: 99;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    line-height: 30px;
}
.live-btn{
    position: absolute;
    bottom: 10px;
    right: 0;
    width: 71px;
    height: 30px;
}
.live-btn span{
    display: block;
    width: 10px;
    height: 10px;
    box-sizing: border-box;
    background-color: #f6f6f6;
    border-radius: 10px;
    float: left;
    margin: 13px 0px 0px 10px;
    cursor: pointer;
}
.live-btn span:hover{
    background-color: #01A1D6;
    border: 2px solid #fff;
    transform: scale(1.3);
}
/* 动画部分 */
.animation{
    width: 100%;
    height: 430px;  
}
.donghua{
    width: 1164px;
    height: 430px;
    margin-top: 130px;
    margin-bottom: 80px;
}
.donghua-1{
    width: 1164px;
    height: 36px;
}
#bili-douga{
    width: 30px;
    height: 30px;
    float: left;
    margin-top: 3px;
}
.donghua-12{
    width: 60px;
    height: 28px;
    float: left;
    font-size: 20px;
    color: #212121;
    margin: 3px 0px 0px 56px;
}
.donghua-13{
    width: 60px;
    height: 22px;
    float: left;
    border: 1px solid #999;
    margin: -31px 0px 0px 1100px;
    cursor: pointer;
}
.donghua-13:hover{
    background-color: #e7e7e7;
}
.donghua-2{
    width: 1164px;
    height: 375px;
    margin-top: 15px;
}
.donghua-21{
    width: 856px;
    height: 375px;
    float: left;
}
.donghua-21-1{
    width: 206px;
    height: 190px;
    float: left;   
}
.donghua-21-2{
    width: 206px;
    height: 190px;
    float: left;
    margin-left: 10px;   
}
.donghua-21-1-2{
    width: 206px;
    height: 21px;
    margin-top: 95px;
    background-color: rgba(0, 0, 0, 0.2);
}
.icon-20{
    width: 16px;
    height: 16px;
    float: left;
    font-size: 14px;
    color: #fff;
    margin: 3px 0px 0px 0px;
}
.donghua-11-1{
    width: 52px;
    height: 16px;
    float: left;
    font-size: 12px;
    color: #fff;
    margin: 2px 0px 0px 4px;
}
.donghua-21-11{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-1.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-11:hover{
    background-image: url(../img/动画-1.webp);
    transition: all 0.5s;
}

.donghua-21-12{
    width: 206px;
    height: 60px;
    float: left;
}
.donghua-21-12-21{
    width: 206px;
    height: 40px;
    float: left;
    font-size: 14px;
    color: #212121;
    margin: 0px 0px 0px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}
.donghua-21-12-21:hover{
    color: #00a1d6;
}
.donghua-21-12-22{
    width: 200px;
    height: 20px;
    float: left;
    font-size: 12px;
    color: #999;
    cursor: pointer;
    margin-left: 5px;
}
.donghua-21-12-22:hover{
    color: #00a1d6;
}
.up{
    width: 16px;
    height: 16px;
    float: left;
    border: 1px solid #999;
    border-radius: 3px;
}
.up-1{
    width: 180px;
    height: 16px;
    line-height: 16px;
    margin-left: 25px;
}
.donghua-21-111{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-2.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-111:hover{
    background-image: url(../img/动画-2.webp);
    transition: all 0.5s;
}
.donghua-21-112{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-3.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-112:hover{
    background-image: url(../img/动画-3.webp);
    transition: all 0.5s;
}
.donghua-21-113{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-4.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-113:hover{
    background-image: url(../img/动画-4.webp);
    transition: all 0.5s;
}
.donghua-21-114{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-5.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-114:hover{
    background-image: url(../img/动画-5.webp);
    transition: all 0.5s;
}
.donghua-21-115{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-6.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-115:hover{
    background-image: url(../img/动画-6.webp);
    transition: all 0.5s;
}
.donghua-21-116{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-7.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-116:hover{
    background-image: url(../img/动画-7.webp);
    transition: all 0.5s;
}
.donghua-21-117{
    width: 206px;
    height: 116px;
    float: left;
    background-image: url(../img/动画-8.webp);
    background-size: 206px 116px;
    border-radius: 5px;
    cursor: pointer;
}
.donghua-21-117:hover{
    background-image: url(../img/动画-8.webp);
    transition: all 0.5s;
}
.donghua-22{
    width: 265px;
    height: 375px;
    float: right;
    cursor: pointer;
    z-index: 99;
}
.donghua-22-1{
    width: 265px;
    height: 64px;
    float: left;
    position: relative;
    top: 0;
    left: 0;
    margin: 0px 0px 15px;
}
.number-1{
    width: 18px;
    height: 18px;
    color: #fff;
    background: #00a1d6;
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    border-radius: 2px;
}
.dh-1{
    width: 235px;
    height: 64px;
    float: left;
    margin: -18px 0px 0px 30px;
}
.dh-11{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/dh-1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}
.dh-11-1{
    width: 30px;
    height: 30px;
    float: right;
    margin: 30px 7px 0px 0px;
    background-color: rgba(0, 0, 0, 0.1);
    background-image: url(../img/播放键.png);
    background-size: 30px 30px;
    border-radius: 2px;
    background-repeat: no-repeat;
    display: none;
}
.dh-11:hover .dh-11-1{
    display: block;
}
.dh-12{
    width: 111px;
    height: 64px;
    float: right;
}
.dh-13{
    width: 111px;
    height: 40px;
    font-size: 14px;
    color: #212121;
}
.dh-13:hover{
    color: #73c9e5;
}
.dh-14{
    width: 111px;
    height: 14px;
    font-size: 12px;
    color: #999;
    margin-top: 10px;
}
.dh-1-2{
    width: 260px;
    height: 100px;
    background-color: #fff;
    box-shadow: 1px 1px 1px 1px #e7e7e7;
    border-radius: 2px;
    position: absolute;
    top: -110px;
    left: 10px;
    display: none;
}
.donghua-22-1:hover .dh-1-2{
    display: block;
}
.dh-1-21{
    width: 150px;
    height: 80px;
    border-radius: 2px;
    margin: 10px 0px 0px 10px;
}
.dh-1-21-1{
    width: 245px;
    height: 50px;
    border-bottom: 1px solid #E7E7E7;
}
.dh-1-21-11{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-1.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-12{
    width: 150px;
    height: 50px;
    float: right;
}
.dh-13-1{
    width: 150px;
    height: 30px;
    font-size: 12px;
    color: #212121;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.dh-14-1{
    width: 190px;
    height: 14px;
    transform: scale(0.6);
    line-height: 14px;
    color: #999;
    margin-left: -35px;
}
.dh-1-21-2{
    width: 260px;
    height: 30px;
}
.dh-1-21-21{
    width: 55px;
    height: 20px;
    float: left;
    margin-top: 5px;
    margin-left: 5px;
}
.icon-21{
    width: 15px;
    height: 20px;
    display: inline-block;
    font-size: 16px;
    line-height: 20px;
    color: #E7E7E7;
}
.icon-21-1{
    width: 58px;
    height: 20px;
    float: left;
    transform: scale(0.7);
    line-height: 20px;
    color: #E7E7E7;
    margin: -20px 0px 0px 10px;
}
.donghua-22-2{
    width: 265px;
    height: 20px;
    float: left;
    margin: 0px 0px 15px;
    position: relative;
    top: 0;
    left: 0;
}
.number-1{
    width: 18px;
    height: 18px;
    color: #fff;
    background: #00a1d6;
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    border-radius: 2px;
}
.dh-2{
    width: 235px;
    height: 20px;
    float: left;
    line-height: 20px;
    margin: -18px 0px 0px 30px;
    font-size: 14px;
    color: #212121;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.dh-2:hover{
    color: #73c9e5;
    transition: all 0.5s;
}
.dh-1-3{
    width: 280px;
    height: 100px;
    background-color: #fff;
    box-shadow: 1px 1px 1px 1px #e7e7e7;
    border-radius: 2px;
    position: absolute;
    top: -110px;
    left: 10px;
    display: none;
}
.donghua-22-2:hover .dh-1-3{
    display: block;
}
.dh-1-21-111{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-2.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-112{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-3.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.number-2{
    width: 18px;
    height: 18px;
    color: #999;
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    border-radius: 2px;
}
.dh-1-21-113{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-4.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-114{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-5.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-115{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-6.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-116{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-7.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-117{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-8.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-118{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-9.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.dh-1-21-119{
    width: 90px;
    height: 40px;
    float: left;
    background-image: url(../img/dh-10.webp);
    background-size: 90px 40px;
    margin-left: 5px;
}
.adv-two{
    width: 100%;
    height: 83px;  
    float: left;
}
.gao-upone{
    width: 1164px;
    height: 83px;
    position: absolute;
    background-image: url(../img/12.jpg);
    background-size: 1164px 83px;
    margin-top: 75px;
    cursor: pointer;
}
.drama{
    width: 100%;
    height: 360px;  
}
.fan{
    width: 830px;
    height: 414px;
    float: left;
    margin-top: 160px;
}
.fan-head{
    width: 830px;
    height: 36px;
    margin: 0px 0px 16px;
}
/* 动漫logo */
#bili-anime{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 9px 0px 10px;
}
.icon-fan-1{
    width: 40px;
    height: 36px;
    float: left;
    line-height: 32px;
    text-align: center;
    font-size: 20px;
    color: #212121;
    margin: 0px 24px 0px 0px;
    cursor: pointer;
}
.icon-fan-1:hover{
    color: #00a1d6;
    transition: all 0.5s;
}
.cartoon-top {
    width: 416px;
    height: 36px;
    float: left;
    margin: 0px 0px 0px 4px;
    text-align: center;
    line-height: 36px;
    font-size: 14px;
}
.cartoon-top > a {
    color: #333;
    margin: 5px;
    padding: 5px 5px;
}
.cartoon-top .cart-on {
    color: #00a1d6;
    border-bottom: 1px solid #00a1d6;
}
.fan2{
    width: 130px;
    height: 35px;
    float: right;
    line-height: 35px;
    color: #00a1d6;
    background-color: #FCBA2A;
    border: 1px solid #00a1d6;
    background-color: #fff;
    border-radius: 2px;
}
.fan2-1{
    width: 70px;
    height: 30px;
    float: left;
    font-size: 14px;
    margin-left: 25px;
    cursor: pointer;
}
.icon-fan2{
    width: 16px;
    height: 16px;
    float: left;
    font-size: 16px;
    line-height: 36px;
}
.fan2:hover{
    color: #fff;
    background-color: #00a1d6;
    transition: all 0.5s;
}
/* 番剧周内容 */
.drama-view{
    width: 830px;
    height: 363px;
    margin: 15px auto;
    position: relative;
}
.drama-view > .fan-content{
    position: absolute;
    width: 830px;
    height: 363px;
    background-color: #fff;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    overflow: auto;
}
.cart-no{
    width: 100%;
    height: 100%;
    background-image: url(../img/no-new-update.png);
    background-repeat: no-repeat;
    background-position: 50%;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}
.cart-no span{
    display: block;
    float: left;
    width: 100%;
    height: 50px;
    margin-top: 120px;
    color: #99a2aa;
    font-size: 14px;
}
.fan-c1{
    width: 210px;
    height: 70px;
    margin: 0px 20px 24px 0px;
    cursor: pointer;
}
.c1-1{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-1.webp);
    background-size: 70px 70px;
}
.c1-2{
    width: 135px;
    height: 70px;
    float: left;
    margin-left: 5px;
}
.c1-21{
    width: 135px;
    height: 37px;
    font-size: 14px;
    color: #212121;
    margin: 2px 0px 12px;
}
.c1-21:hover{
    color: #00a1d6;
    transition: all 0.5s;
}
.c1-22{
    width: 135px;
    height: 16px;
    font-size: 12px;
    color: #00a1d6;
}
.c1-12{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-2.webp);
    background-size: 70px 70px;
}
.c1-13{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-3.webp);
    background-size: 70px 70px;
}
.c1-14{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-4.webp);
    background-size: 70px 70px;
}
.c1-15{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-5.webp);
    background-size: 70px 70px;
}
.c1-16{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-6.webp);
    background-size: 70px 70px;
}
.c1-17{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-7.webp);
    background-size: 70px 70px;
}
.c1-18{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-8.webp);
    background-size: 70px 70px;
}
.c1-19{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-9.webp);
    background-size: 70px 70px;
}
.c1-20{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-10.webp);
    background-size: 70px 70px;
}
.c1-211{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-11.webp);
    background-size: 70px 70px;
}
.c1-212{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-12.webp);
    background-size: 70px 70px;
}
.c1-213{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-13.webp);
    background-size: 70px 70px;
}
.c1-214{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-14.webp);
    background-size: 70px 70px;
}
.c1-215{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-15.webp);
    background-size: 70px 70px;
}
.c1-216{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/番剧-16.webp);
    background-size: 70px 70px;
}
.ju{
    width: 320px;
    height: 414px;
    float: left;
    margin-top: 160px;
    margin-left: 14px;
    z-index: 99;
}
.ju-head{
    width: 320px;
    height: 36px;
    margin: 0px 0px 16px;
}
.ju-head-1{
    width: 60px;
    height: 30px;
    float: left;
    font-size: 20px;
    color: #212121;
    line-height: 36px;
}
.ju-head-2{
    width: 60px;
    height: 22px;
    float: right;
    font-size: 12px;
    color: #505050;
    line-height: 36px;
    border: 1px solid #999;
    text-align: center;
    line-height: 22px;
    margin: 5px 0px 0px 0px;
    border-radius: 2px;
    cursor: pointer;
}
.ju-head-2:hover{
    background-color: rgba(0, 0, 0, 0.1);
}
.ju-1{
    width: 320px;
    height: 20px;
    margin: 0px 0px 18px;
}
.numb-1{
    width: 18px;
    height: 18px;
    float: left;
    text-align: center;
    margin-top: 1px;
    background-color: #01A1D6;
    font-size: 14px;
    color: #fff;
    border-radius: 2px;
}
.ju-1-1{
    width: 198px;
    height: 20px;
    float: left;
    font-size: 14px;
    color: #212121;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin: 1px 0px 0px 10px;
    cursor: pointer;
}
.ju-1-1:hover{
    color: #00a1d6;
    transition: all 0.5s;
}
.ju-1-2{
    width: 90px;
    height: 20px;
    float: left;
    font-size: 12px;
    color: #999;
    text-align: right;
    margin: 1px 0px 0px 4px;
    cursor: pointer;
}
.numb-2{
    width: 18px;
    height: 18px;
    float: left;
    text-align: center;
    margin-top: 1px;
    font-size: 14px;
    color: #999;
    border-radius: 2px;
}
.drama_state{
    width: 100%;
    height: 360px;  
}
.fandong{
    width: 830px;
    height: 428px;
    float: left;
    margin-top: 80px;
}
.fandong-head{
    width: 830px;
    height: 36px;
    margin: 0px 0px 16px;
}
.fd-h1{
    width: 100px;
    height: 36px;
    float: left;
    font-size: 20px;
    color: #212121;
    line-height: 36px;
    cursor: pointer;
}
.fd-h1:hover{
    color: #00a1d6;
    transition: all 0.5s;
}
.fd-h2{
    width: 148px;
    height: 36px;
    float: right;
}
.fandong-content{
    width: 830px;
    height: 376px;
}
.fd-con1{
    width: 200px;
    height: 174px;
    float: left;
    cursor: pointer;
    padding-bottom: 14px;
}
.fd-con1-1{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-1.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.fd-con1-11{
    width: 189px;
    height: 16px;
    padding: 6px 8px;
    background-color: rgba(0, 0, 0, 0.1);
    margin-top: 88px;
    line-height: 16px;
}
.fd-con1-11-1{
    width: 43px;
    height: 16px;
    float: right;
    color: #fff;
    font-size: 12px;
}
.fd-con1-2{
    width: 200px;
    height: 50px;
    font-size: 14px;
    color: #212121;
    margin: 10px 0px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fd-con1-2:hover{
    color: #00a1d6;
    transition: all 0.5s;
}
.fd-con2{
    width: 200px;
    height: 174px;
    float: left;
    margin-left: 10px;
    cursor: pointer;
    padding-bottom: 14px;
}
.fd-con1-12{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-2.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.fd-con1-13{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-3.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.fd-con1-14{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-4.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.fd-con1-15{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-5.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.fd-con1-16{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-6.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.fd-con1-17{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-7.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.fd-con1-18{
    width: 200px;
    height: 116px;
    border-radius: 2px;
    background-image: url(../img/fd-8.webp);
    background-size: 200px 116px;
    overflow: hidden;
}
.guan{
    width: 40px;
    height: 24px;
    float: left;
    background-image: url(../img/皇冠-2.png);
    background-size: 40px 24px;
}
.judong{
    width: 320px;
    height: 428px;
    float: left;
    margin-top: 80px;
    margin-left: 14px;
}
.judong-head{
    width: 320px;
    height: 36px;
    font-size: 20px;
    color: #212121;
    margin: 0px 0px 16px;
}
/* 番剧右边轮波图 */
.drama-s-right{
    position: relative;
    width: 320px;
    height: 314px;
    float: right;
    border-radius: 2px;
    cursor: pointer;
    overflow: hidden;
}
.drama-s-a{
    width: 640px;
    height: inherit;
    position: relative;
}
.drama-s-a a{
    width: 320px;
    height: inherit;
    display: block;
    float: left;
    position: absolute;
    transition: transform 500ms;
}
.drama-s-a a img{
    width: 320px;
    position: absolute;
}
.drama-s-a a p{
    position: absolute;
    bottom: 0px;
    left: 5px;
    width: 122px;
    z-index: 99;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    line-height: 30px;
}
.drama-btn{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 93px;
    height: 30px;
}
.drama-btn span{
    display: block;
    width: 10px;
    height: 10px;
    box-sizing: border-box;
    background-color: #f6f6f6;
    border-radius: 10px;
    float: left;
    margin: 13px 0px 0px 10px;
    cursor: pointer;
}
.drama-btn span:hover{
    background-color: #01A1D6;
    border: 2px solid #fff;
    transform: scale(1.3);
}
.drama-on{
    background-image: url(../img/鱼头.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-color: transparent;
    border-width: 0;
    transition-property: transform;
    transition-duration: 250ms;
    transform: scale(2);
} 

/* 漫画 */
.aimtron{
    width: 100%;
    height: auto;
}
.guo{
    width: 830px;
    height: 414px;
    float: left;
    margin-top: 40px;
    padding-bottom: 60px;
}
.chuang{
    width: 320px;
    height: 414px;
    float: left;
    margin-top: 40px;
    margin-left: 14px;
    padding-bottom: 60px;
}
/* 国创logo */
#bili-guochuang{
    width: 30px;
    height: 30px;
    float: left;
    margin: 0px 6px 0px 0px;
}
/* 国创周内容 */
.guo-top {
    width: 416px;
    height: 36px;
    float: left;
    margin: 0px 0px 0px 4px;
    text-align: center;
    line-height: 36px;
    font-size: 14px;
}
.guo-top > a {
    color: #333;
    margin: 5px;
    padding: 5px 5px;
}
.guo-top > .guo-on {
    color: #00a1d6;
    border-bottom: 1px solid #00a1d6;
}
.guo-view{
    width: 830px;
    height: 363px;
    margin: 15px auto;
    position: relative;
}
.guo-view > .guo-content{
    position: absolute;
    width: 830px;
    height: 376px;
    background-color: #fff;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    overflow: auto;
}
.guo-no{
    width: 100%;
    height: 100%;
    background-image: url(../img/no-new-update.png);
    background-repeat: no-repeat;
    background-position: 50%;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}
.guo-no span{
    display: block;
    float: left;
    width: 100%;
    height: 50px;
    margin-top: 120px;
    color: #99a2aa;
    font-size: 14px;
}
.guo-c1{
    width: 227px;
    height: 70px;
    float: left;
    margin: 0px 30px 24px 0px;
    cursor: pointer;
}
.g1{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-1.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g2{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-2.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g3{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-3.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g4{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-4.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g5{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-5.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g6{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-6.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g7{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-7.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g8{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-8.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g9{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-9.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
.g10{
    width: 70px;
    height: 70px;
    float: left;
    background-image: url(../img/国-10.webp);
    background-size: 70px 70px;
    border-radius: 2px;
}
/* 国创右边轮波图 */
.aim-s-right{
    position: relative;
    width: 320px;
    height: 110px;
    float: right;
    border-radius: 2px;
    cursor: pointer;
    overflow: hidden;
}
.aim-s-a{
    width: 640px;
    height: inherit;
    position: relative;
}
.aim-s-a a{
    width: 320px;
    height: inherit;
    display: block;
    float: left;
    position: absolute;
    transition: transform 500ms;
}
.aim-s-a a img{
    width: 320px;
    position: absolute;
}
.aim-s-a a p{
    /* position: absolute;
    bottom: 0px;
    left: 5px; */
    /* width: 122px; */
    /* z-index: 99; */
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    line-height: 30px;
}
.aim-btn{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 93px;
    height: 30px;
}
.aim-btn span{
    display: block;
    width: 10px;
    height: 10px;
    box-sizing: border-box;
    background-color: #f6f6f6;
    border-radius: 10px;
    float: left;
    margin: 13px 0px 0px 18px;
    cursor: pointer;
}
.aim-btn span:hover{
    background-color: #01A1D6;
    border: 2px solid #fff;
    transform: scale(1.3);
}
.aim-on{
    background-image: url(../img/鱼头.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-color: transparent;
    border-width: 0;
    transition-property: transform;
    transition-duration: 250ms;
    transform: scale(2);
} 

/* 原产国创相关 */
.aimtron_origin{
    width: 100%;
    height: auto;
}
.yuan-left{
    width: 830px;
    height: 457px;
    float: left;
    padding-bottom: 30px;
}
.yuan-left-head{
    width: 830px;
    height: 36px;
    margin: 0px 0px 16px;
}
.yuan-left-h1{
    width: 120px;
    height: 36px;
    float: left;
    font-size: 20px;
    color: #212121;
    line-height: 36px;
    margin: 0px 20px 0px 0px;
    cursor: pointer;
}
.yuan-left-h1:hover{
    color: #00a1d6;
}
.yuan-left-h2{
    width: 148px;
    height: 22px;
    float: right;
}
.yuan-content{
    width: 830px;
    height: 404px;
}
.yuan-con1{
    width: 200px;
    height: 190px;
    float: left;
    cursor: pointer;
    margin-right: 10px;
    padding-bottom: 12px;
}
.yuan-con1-img1{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-con1-1{
    width: 195px;
    height: 40px;
    float: left;
    font-size: 14px;
    color: #212121;
    margin: 5px 0px 8px;
    padding: 0px 12px 0px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.yuan-con1-1:hover{
    color: #00a1d6;
    transition: all 0.3s;
}
.yuan-con1-2{
    width: 195px;
    height: 16px;
    float: left;
    font-size: 12px;
    color: #999;
    line-height: 16px;
}
.up-2{
    width: 16px;
    height: 16px;
    float: left;
    border: 1px solid #999;
    border-radius: 2px;
    margin-right: 10px;
}
.up-3{
    width: 110px;
    height: 16px;
    float: left;
}
.yuan-con1-img2{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-con1-img3{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-con2{
    width: 200px;
    height: 190px;
    float: left;
    cursor: pointer;
    padding-bottom: 12px;
}
.yuan-con1-img4{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-con1-img5{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-con1-img6{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-con1-img7{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-con1-img8{
    width: 200px;
    height: 116px;
    background-image: url(../img/原-8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.yuan-right{
    width: 320px;
    height: 457px;
    float: left;
    margin-left: 14px;
    padding-bottom: 30px;
}
.yuan-right-h{
    width: 320px;
    height: 36px;
    float: left;
    margin: 0px 0px 16px;
    /* background-color: #f59999; */
}
.yuan-right-h1{
    width: 60px;
    height: 28px;
    float: left;
    font-size: 20px;
    color: #212121;
    line-height: 36px;
}
.yuan-right-h2{
    width: 58px;
    height: 22px;
    float: left;
    border: 1px solid #999;
    margin: 5px 0px 0px 200px;
    border-radius: 2px;
    color: #505050;
    cursor: pointer;
}
.yuan-right-h2:hover{
    background-color: rgba(0, 0, 0, 0.1);
}
.yuan-right-con{
    width: 265px;
    height: 375px;
    float: left;
    cursor: pointer;
}
.yuan-right-con1{
    width: 320px;
    height: 64px;
    float: left;
    position: relative;
    top: 0;
    left: 0;
    margin: 0px 0px 15px;
}
.yuan-right-con11{
    width: 330px;
    height: 130px;
    background-color: #fff;
    box-shadow: 0px 0px 8px 4px #e7e7e7;
    border-radius: 2px;
    position: absolute;
    top: -135px;
    left: 10px;
    display: none;
}
.yuan-right-con1:hover .yuan-right-con11{
    display: block;
}
.number-21{
    width: 280px;
    height: 20px;
    float: left;
    line-height: 20px;
    margin: -18px 0px 0px 30px;
    font-size: 14px;
    color: #212121;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.number-21:hover{
    color: #73c9e5;
    transition: all 0.5s;
}
.yuan-right-con1-two{
    width: 305px;
    height: 80px;
    border-bottom: 1px solid #E7E7E7;
}
.yuan-right-con1-56{
    width: 205px;
    height: 63px;
    float: right;
}
.yuan-right-con1-5{
    width: 205px;
    height: 40px;
    font-size: 12px;
    color: #212121;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.yuan-right-con1-6{
    width: 205px;
    height: 20px;
    transform: scale(0.6);
    line-height: 14px;
    color: #999;
    margin-left: -35px;
}
.yuan-right-con1-two1{
    width: 310px;
    height: 30px;
}
.yuan-right-con1-1{
    width: 290px;
    height: 64px;
    float: left;
    margin: -18px 0px 0px 30px;
}
.yuan-right-con1-2{
    width: 166px;
    height: 64px;
    float: right;
}
.yuan-right-con1-3{
    width: 166px;
    height: 40px;
    font-size: 14px;
    color: #212121;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.yuan-right-con1-3:hover{
    color: #73c9e5;
}
.yuan-right-con1-4{
    width: 166px;
    height: 14px;
    font-size: 12px;
    color: #999;
    margin-top: 10px;
}
.yuan-9{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/原-9.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}
.yuan-91{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-9.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-right-con2{
    width: 320px;
    height: 20px;
    float: left;
    position: relative;
    top: 0;
    left: 0;
    margin: 0px 0px 18px;
}
.yuan-right-con21{
    width: 320px;
    height: 130px;
    background-color: #fff;
    box-shadow: 0px 0px 8px 4px #e7e7e7;
    border-radius: 2px;
    position: absolute;
    top: -135px;
    left: 10px;
    display: none;
}
.yuan-right-con2:hover .yuan-right-con21{
    display: block;
}
.yuan-10{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-10.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-11{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-11.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-12{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-12.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-13{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-13.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-14{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-14.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-15{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-15.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-16{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-16.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-17{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-17.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-18{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原1-18.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.yuan-19{
    width: 90px;
    height: 63px;
    float: left;
    background-image: url(../img/原-19.webp);
    background-size: 90px 63px;
    margin-left: 5px;
}
.adv-three{
    width: 100%;
    height: 83px; 
    overflow: hidden;
    padding-bottom: 30px;
}
.gao-uptwo{
    width: 1164px;
    height: 83px;
    position: absolute;
    background-image: url(../img/gao-up2.jpg);
    background-size: 1164px 83px;
    cursor: pointer;
}
.gao-uptwo-words{
    width: 38px;
    height: 20px;
    float: left;
    font-size: 12px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    background-color: rgba(0, 0, 0, 0.1);
    border: 1px solid #999;
    margin: 55px 0px 0px 10px;
}
.cartoon-left{
    width: 830px;
    height: 633px;
    float: left;
    margin-top: 40px;
    padding-bottom: 60px;
}
#bili-ic_partition_Comic{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.cartoon-title-ul{
    width: 210px;
    height: 36px;
    float: left;
    font-size: 12px;
    margin: 0px 0px 0px 4px;
    cursor: pointer;
}
.cartoon-title-ul-1{
    width: 48px;
    height: 20px;
    float: left;
    color: #00a1d6;
    text-align: center;
    border-bottom: 1px solid #00a1d6;
    margin: 8px 12px 0px 0px;
}
.cartoon-title-ul-2{
    width: 72px;
    height: 20px;
    float: left;
    color: #505050;
    text-align: center;
    margin: 8px 12px 0px 0px;
}
.cartoon-title-ul-3{
    width: 48px;
    height: 20px;
    float: left;
    color: #505050;
    text-align: center;
    margin: 8px 12px 0px 0px;
    position: relative;
}
.cartoon-title-ul-3-1{
    position: absolute;
    top: -18px;
    right: -54px;
    width: 72px;
    height: 20px;
    float: left;
    color: #fff;
    background-color: #fa5a57;
    border-radius: 10px;
    text-align: center;
    line-height: 20px;
}
.cartoon-title-ul-3:hover{
    color: #00a1d6;
    transition: all 0.3s;
}
.cartoon-content{
    width: 830px;
    height: 581px;
    padding-bottom: 30px;
}
.cartoon-con-box{
    width: 160px;
    height: 267px;
    float: left;
    margin: 0px 7px 20px 0px;
    cursor: pointer;
}
.cartoon-con-box1{
    width: 160px;
    height: 267px;
    float: left;
    margin: 0px 0px 20px 0px;
    cursor: pointer;
}
.cartoon-1{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-1.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-1-title{
    width: 160px;
    height: 18px;
    float: left;
    font-size: 14px;
    color: #212121;
    margin: 10px 0px 8px;
}
.cartoon-con-box:hover .cartoon-1-title{
    color: #00a1d6;
    transition: all 0.3s;
}
.cartoon-con-box1:hover .cartoon-1-title{
    color: #00a1d6;
    transition: all 0.3s;
}
.cartoon-1-tag{
    width: 160px;
    height: 16px;
    float: left;
    font-size: 12px;
    color: #999;
}
.cartoon-2{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-2.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-3{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-3.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-4{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-4.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-5{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-5.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-6{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/rartoon-6.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-7{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-7.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-8{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-8.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-9{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-9.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-10{
    width: 160px;
    height: 216px;
    float: left;
    background-image: url(../img/cartoon-10.webp);
    background-size: 160px 216px;
    border-radius: 2px;
}
.cartoon-right{
    width: 320px;
    height: 633px;
    float: left;
    margin-top: 40px;
    margin-left: 14px;
    padding-bottom: 30px;
}
.cartoon-ul{
    width: 120px;
    height: 20px;
    float: left;
    margin: 8px 0px 0px 20px;
    font-size: 12px;
    cursor: pointer;
}
.cartoon-ul-1{
    width: 24px;
    height: 20px;
    float: left;
    color: #00a1d6;
    border-bottom: 1px solid #00a1d6;
    margin: 0px 12px 0px 0px;
}
.cartoon-ul-2{
    width: 24px;
    height: 20px;
    float: left;
    color: #505050;
    margin: 0px 12px 0px 0px;
}
.cartoon-right-1{
    width: 320px;
    height: 156px;
    float: left;
    padding: 0px 0px 9px;
}
.cartoon-right-1-1{
    width: 290px;
    height: 149px;
    float: left;
    cursor: pointer;
}
.cartoon-right-img{
    width: 112px;
    height: 149px;
    float: left;
    background-image: url(../img/cartoon-right-img.webp);
    background-size: 112px 149px;
    border-radius: 2px;
}
.cartoon-right-1-11{
    width: 70px;
    height: 149px;
    float: left;
    margin: 0px 0px 0px 12px;
}
.title{
    width: 70px;
    height: 20px;
    float: left;
    font-size: 14px;
    color: #212121;
    margin: 0px 0px 12px;
}
.cartoon-right-1-1:hover .title{
    color: #00a1d6;
    transition: all 0.3s;
}
.style{
    width: 70px;
    height: 18px;
    float: left;
    font-size: 12px;
    color: #999;
}
.update{
    width: 70px;
    height: 18px;
    float: left;
    font-size: 12px;
    color: #999;
}
.cartoon-right-2{
    width: 320px;
    height: 20px;
    float: left;
    padding: 9px 0px;
    line-height: 20px;
}
.cartoon-right-2:hover .ju-1-1{
    color: #00a1d6;
    transition: all 0.3s;
}
/* 音乐 */
#bili-music{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.music-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/music-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.music-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/music-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}

/* 灰皇冠 */
.hui-guan{
    width: 40px;
    height: 24px;
    float: left;
    background-image: url(../img/hui-icon_silver.png);
    background-size: 40px 24px;
}

/* 舞蹈 */
#bili-dance{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.dance-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/dance-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dance-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/dance-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}

/* 游戏 */
#bili-game{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.game-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/game-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.game-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/game-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}

/* 知识 */
#bili-technology{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.tec-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/tec-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.tec-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/tec-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}

/* 课堂 */
#bili-teach{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}

.teach-box{
    width: 100%;
    height: auto;
}
.teach-left{
    width: 830px;
    height: 374px;
    float: left;
    padding-bottom: 80px;
}
.teach-content{
    width: 830px;
    height: 328px;
}
.teach-con1{
    width: 200px;
    height: 170px;
    float: left;
    cursor: pointer;
    margin-right: 10px;
    padding-bottom: 12px;
}
.teach-con1-1{
    width: 195px;
    height: 20px;
    float: left;
    font-size: 14px;
    color: #212121;
    margin: 5px 0px 8px;
    padding: 0px 12px 0px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.teach-con1-1:hover{
    color: #00a1d6;
    transition: all 0.3s;
}
.teach-con2{
    width: 200px;
    height: 170px;
    float: left;
    cursor: pointer;
    padding-bottom: 12px;
}
.teach-right{
    width: 320px;
    height: 374px;
    float: left;
    margin-left: 14px;
    padding-bottom: 30px;
}
.teach-right a{
    width: inherit;
    height: inherit;
    display: block;
}
.teach-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.teach-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.teach-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.teach-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.teach-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.teach-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.teach-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.teach-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/teach-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}


/* 数码 */
#bili-digital{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.dig-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/dig-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.dig-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/dig-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}

/* 汽车 */
#bili-car{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.car-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/car-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.car-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/car-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}


/* 生活 */
#bili-life{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.life-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/life-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.life-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/life-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}



/* 美食 */
#bili-food{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.food-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/food-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.food-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/food-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}


/* 动物圈 */
#bili-animal{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.aim-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/aim-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.aim-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/anim-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}


/* 鬼畜 */
#bili-kichiku{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.kuchi-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/kuchi-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.kuchi-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/kuchi-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}

/* 时尚 */
#bili-fashion{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.fashion-img-one{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l1.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-img-two{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l2.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-img-three{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l3.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-img-four{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l4.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-img-five{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l5.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-img-six{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l6.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-img-seven{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l7.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-img-eight{
    width: 200px;
    height: 116px;
    background-image: url(../img/fashion-l8.webp);
    background-size: 206px 116px;
    border-radius: 2px;
    overflow: hidden;
}
.fashion-rimg{
    width: 112px;
    height: 63px;
    float: left;
    background-image: url(../img/fashion-r1.webp);
    background-size: 112px 63px;
    border-radius: 2px;
}



/* 资讯 */
#bili-information{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}

/* 娱乐 */
#bili-ent{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}



/* 专栏 */
#bili-read{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}

/* 电影 */
#bili-movie{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}
.movie-right{
    width: 320px;
    height: 414px;
    float: left;
    margin-left: 14px;
    z-index: 99;
}

/* 电视剧 */
#bili-teleplay{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}

/* 影视 */
#bili-cinephile{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}

/* 纪录片 */
#bili-documentary{
    width: 36px;
    height: 36px;
    float: left;
    margin: 0px 6px 0px 0px;
}




 底部
.footer {
    width: 100%;
    height: 408px;
    float: left;
    padding-top: 50px;
}
.footer-top {
    width: 100%;
    height: 150PX;
    float: left;
    padding-top: 30px;
    background-color: #f6f9fa;
}

.footer-top-left {
    width: 318px;
    height: 150PX;
    float: left;
    margin-left: 93px;
    border-right: 1px solid #EEEEEE;
}

.footer-top-middle {
    width: 498px;
    height: 150PX;
    float: left;
    border-right: 1px solid #EEEEEE;
    margin-left: 30px;
}

.footer-top-right {
    width: 271px;
    height: 150PX;
    float: left;
    margin-left: 40px;
}

.footer-top-left > span {
    font-size: 16px;
    color: #999999;
    margin: 0px 0px 20px;
    display: block;
}

.foot-top-left-one > li {
    font-size: 14px;
    color: #999999;
    float: left;
    margin: 0px 70px 10px 0px;
    color: #212121;
    transition: color 0.3s;
    cursor: pointer;
}

.foot-top-left-one > li:hover {
    color: #00a1d6;
}

.middle-one,
.middle-two,
.middle-three {
    width: 95px;
    height: 120px;
    float: left;
    margin-right: 70px;
}

.footer-top-middle>span {
    font-size: 16px;
    color: #999999;
    margin: 0px 0px 20px;
    display: block;
}
.footer-top-middle>ul>li {
    font-size: 14px;
    color: #999999;
    float: left;
    margin: 0px 0px 10px 0px;
    color: #212121;
    transition: color 0.3s;
    cursor: pointer;
}

.footer-top-middle>ul>li:hover {
    color: #00a1d6;
}
.foot-top-right-one,
.foot-top-right-two,
.foot-top-right-three {
    width: 80px;
    height: 80px;
    display: inline-block;
    margin-top: 40px;
}

.foot-top-right-oneo {
    width: 50px;
    height: 50px;
    background-color: #999999;
    border-radius: 100%;
    line-height: 50px;
    text-align: center;
}

.foot-top-right-twot {
    width: 50px;
    height: 50px;
    background-color: pink;
    border-radius: 100%;
    line-height: 50px;
    text-align: center;
}

.foot-top-right-threet {
    width: 50px;
    height: 50px;
    background-color: greenyellow;
    border-radius: 100%;
    line-height: 50px;
    text-align: center;
}

.icon-foot {
    font-size: 30px;
    color: #f5f5f5;
}

.foot-top-right-one>p,
.foot-top-right-two>p,
.foot-top-right-three>p {
    font-size: 14px;
    margin-top: 10px;
    color: #212121;
    height: 20px;
    transition: color 0.2s;
    cursor: pointer;
}

.foot-top-right-one>p:hover {
    color: #00a1d6;
}

.foot-bottom {
    width: 100%;
    height: 160px;
    float: left;
    padding: 30px 0px 0px 0px;
    background-color: #f6f9fa;
}

.foot-bottom-left {
    width: 98px;
    float: left;
    margin-left: 90px;
}

.foot-bottom-right {
    width: 1100px;
    float: left;
    margin: 5px 0px 0px 20px;
}

.foot-bottom-one {
    width: 1100px;
    height: 20px;
    float: left;
}

.foot-bott-one > li {
    font-size: 12px;
    color: #999999;
    float: left;
    padding: 5px 15px 0px 0px;
}

.ye {
    cursor: pointer;
}

.ye:hover {
    color: #00a1d6;
}



/* 联系客服 */
.contact-help{
    position: fixed;
    z-index: 101;
    left: 0;
    top: calc(50% - 30px);
    margin-top: -36px;
    width: 13px;
    height: 72px;
    transition: all .3s;
    font-size: 12px;
    color: #505050;
    background: #fff;
    border: 1px solid #e7e7e7;
    box-shadow: 0 6px 10px 0 #e7e7e7;
    border-radius: 0 2px 2px 0;
    padding: 8px 7px;
    line-height: 17px;
}
.contact-help:hover{
    background: #f4f4f4;
    color: #505050;
}

/* 跳楼机 */
.jump-nav{
    float: right;
    position: relative;
    right: 10px;
    top: 233px;
    width: 54px;
}
.antenna-left {
    position: absolute;
    top: -10px;
    left: 13px;
    width: 5px;
    height: 18px;
    background-color: #525252;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    transform: rotate(-45deg);
    z-index: 195;
}
.antenna-right {
    position: absolute;
    top: -10px;
    right: 13px;
    width: 5px;
    height: 18px;
    background-color: #525252;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    transform: rotate(45deg);
    z-index: 195;
}
.jump{
    padding-top: 6px;
    position: absolute;
    z-index: 200;
    background: #fff;
    border: 1px solid #e7e7e7;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    z-index: 195;
}
.jump .jump-item{
    width: 54px;
    font-size: 12px;
    color: #333;
    line-height: 24px;
    text-align: center;
    cursor: pointer;
}
.jump .jump-item:hover{
    background-color: #00a1d6;
    color: #fff;
    transition: all .5s;
}
.jump-sort{
    width: 54px;
    height: 32px;
    line-height: 32px;
    position: absolute;
    bottom: -35px;
    left: -1px;
    border: 1px solid #e7e7e7;
    border-top: 1px solid transparent;
    text-align: center;
    cursor: pointer;
}
.icon-sort{
    font-size: 20px;
    color: #e7e7e7;
}
.jump-sort:hover{
    background-color: #00a1d6;
    transition: all .5s;
}
.jump-sort:hover .icon-sort{
    color: #fff;
    transition: all .5s;
}
.jump-img{
    display: none;
    position: absolute;
    top: -45px;
    left: -155px;
    width: 178px;
    height: 639px;
    padding: 28px 20px;
    background-color: hsla(0,0%,100%,.8);
    z-index: 190;
}
.jump-img img{
    position: absolute;
    top: 34px;
    left: 15px;
    background-repeat: no-repeat;
    background-position: 16px 20px;
}
.box{
    z-index: 200;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.5);
    display: none;
}